<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title> CallLib </title>
  <link rel="stylesheet" href="css/main.css">
</head>

<body>
  <div class="rong-container"></div>
  <div class="rong-toolbar">
    <button onclick="callVideo()" class="rong-callvideo"></button>
    <button onclick="callAudio()" class="rong-callaudio"></button>

    <button onclick="acceptVideo()" class="rong-accept"></button>
    <button onclick="hungup()" class="rong-hungup"></button>

    <!-- <button onclick="invite()" class="rong-invite"></button> -->
    <button onclick="mute()" class="rong-mute"></button>
    <button onclick="unmute()" class="rong-unmute"></button>

    <button onclick="videoToAudio()" class="rong-disable-video"></button>
    <button onclick="audioToVideo()" class="rong-disable-audio"></button>
  </div>
  </div>

  <div class="rong-warns">
    <p>兼容说明：</p>
    <ul>
      <li>操作系统: macOS 10.13.3+ 、Win7+</li>
      <li>浏览器: Chrome 57+</li>
    </ul>
    <p>站点要求：</p>
    <ul>
      <li>HTTPS 站点或 localhost, 端口不限</li>
    </ul>
  </div>
</body>
<script src="//cdn.ronghub.com/RongIMLib-2.4.0.js"></script>
<script src="./lib/RongRTC.3.0.1.js"></script>
<script src="./lib/RongCallLib-3.1.1.js"></script>
<script src="./js/init.js"></script>
<script>
  var config = {
    appKey: 'c9kqbb8j',
    groupId: 'mxIAwZ',
    members: [{
      id: "YNMY9mL",
      token: "+tDwoo+lQ6rhLFlLscA3SSgsC5OSDNP42JrBZImFDk0c38rVnpWZSRMCg4IKARbCoc5lmW"
    }, {
      id: "Qh2ECk0bu",
      token: "dNg7VxpXZO74SCBcJ+lQ6rhLFlLscA3SSgsC5Of2ULBgG7MAMM/GT0CpTw94vquOy5fnfYKARbCoc5lmW"
    }, {
      id: "EXAzVDcyq",
      token: "o5STxBP73Mj89UG3+uscA3SSgsC5OYtgA7FDSzQXwrvE0GKhkTLRV7vc5aiTu6ARbCoc5lmW"
    }]
  };

  var params = (function (config) {
    var members = config.members;
    var appKey = config.appKey;

    var index = location.search.slice(1) || 0;
    var member = members[index];
    var inviteUsers = members.filter(function (_member) {
      return _member.id != member.id;
    });
    var inviteUserIds = inviteUsers.map(function (_member) {
      return _member.id;
    });
    return {
      appKey: appKey,
      conversationType: 3,
      userId: member.id,
      inviteUserIds: inviteUserIds,
      token: member.token,
      targetId: config.groupId
    };
  })(config);

  var callbacks = {
    getInstance: function (instance) {
      var toolbar = tools.getDom('.rong-toolbar')[0];
      toolbar.style.display = 'block';
    },
    getCurrentUser: function (userInfo) {
      console.log(userInfo.userId);
    }
  };

  IMLib.init(params, callbacks);
</script>
<script src="./js/demo.js"></script>

</html>